/*
 * @Author: mikey.zhaopeng 
 * @Date: 2018-12-16 09:20:03 
 * @Last Modified by: mikey.zhaopeng
 * @Last Modified time: 2018-12-16 10:20:36
 */
import 'package:flutter/material.dart';
//导入四个自页面
import './dynamic_page.dart';
import './home_page.dart';
import './lib_page.dart';
import './rank_page.dart';

class TabPage extends StatefulWidget {
  @override
  _TabPageState createState() => new _TabPageState();
}

class _TabPageState extends State<TabPage> with SingleTickerProviderStateMixin {
  TabController controller;
  int selectIndex = 0;

  @override
  void initState() {
    super.initState();
    controller = TabController(vsync: this, length: 4);
    controller.addListener(() {
      setState(() {
        selectIndex = controller.index;
      });
    });
  }
  // @override
  // void dispose() {
  //     controller.dispose();
  //     super.dispose();
  //   }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: TabBarView(
        controller: controller,
        physics: NeverScrollableScrollPhysics(),
        children: <Widget>[
          HomePage(),
          RankPage(),
          LibPage(),
          DynamicPage(),
        ],
      ),
      bottomNavigationBar: Material(
        color: Colors.grey[100],
        child: TabBar(
          isScrollable: false,
          indicatorColor: Colors.transparent,
          controller: controller,
          tabs: <Widget>[
            TabBarItem(
              title: '首页',
              icon: Icons.home,
              selected: selectIndex == 0,
            ),
            TabBarItem(
              title: '排行',
              icon: Icons.local_play,
              selected: selectIndex == 1,
            ),
            TabBarItem(
              title: '片库',
              icon: Icons.ondemand_video,
              selected: selectIndex == 2,
            ),
            TabBarItem(
              title: '动态',
              icon: Icons.camera,
              selected: selectIndex == 3,
            ),
          ],
        ),
      ),
    );
  }
}

class TabBarItem extends StatelessWidget{
  TabBarItem({@required this.icon,@required this.title,@required this.selected});
  final IconData icon;
  final String title;
  final bool selected;
  @override
  Widget build(BuildContext context){
    final Color selectedColor = Theme.of(context).primaryColor;
    final Color normalColor = Colors.grey;
    final Color color = selected?Theme.of(context).primaryColor:Colors.grey;
    return  Container(
        height: 48.0,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: <Widget>[
            Icon(
              icon,
              color:selected?selectedColor:normalColor,
            ),
            Text(
              title,
              style: TextStyle(
                fontSize: 11.0,
                color:selected?selectedColor:normalColor,
              ),
            ),
          ],
        ),
    );
  }
}